<%-- 
    Document   : accountDetail
    Created on : May 8, 2013, 12:02:13 AM
    Author     : DIEM PHUONG
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@include file="/WEB-INF/header.jsp" %>

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body onload="loadAccountDetailInfo()">
        <div>
            <h3>ACCOUNT INFORMATION</h3>
        </div>
        <c:set var="role" value="${sessionScope.ROLE}"/>
        <c:if test="${role=='Admin'}">
            <a href="AdminController?action=manageProduct"> <b>Go to Administration Panel</b></a>
        </c:if>
        <div>
            <input type="hidden" name="success_url" value="">
            <input type="hidden" name="error_url" value="">
        </div>
        <ul>
            <li>
                <div>
                    <label class="required"><em>*</em>Username</label>
                    <span><input type="text" name="txtUsernameReg" value="" id="txtUsernameReg" class="input-text required-entry" placeholder=" Username must be at least 6 characters." maxlength="20" onchange="username(this.value)"/></span>
                    <font id="txtHint" style="color: red"> ${requestScope.username}</font>
                </div>
            </li>
            <li>
                <div>
                    <label class="required"><em>*</em>Full name</label>
                    <span><input type="text" name="txtFullname" value="" id="txtFullname" maxlength="50" class="input-text required-entry" placeholder=" There are no number or special character: @, # $ % v.v..."/></span>
                </div>
            </li>
            <li>
                <div>
                    <label class="required"><em>*</em>Email</label>
                    <span><input type="text" name="txtEmail" value="" id="txtEmail" class="input-text validate-email required-entry" maxlength="50" placeholder=" Email address have the form ***@***.***" /></span>
                    <font class="error" id="email" style="color: red"></font>
                </div>
            </li>
            <li>
                <div>
                    <label>Address</label>
                    <span><input type="text" name="txtAddress" value="" id="txtAddress" maxlength="50"/></span>
                    <font class="error" id="address" style="color: red"></font>
                </div>
            </li>
            <li>
                <div>
                    <label>Phone</label>
                    <span><input type="text" name="txtPhone" value="" id="txtPhone" maxlength="11" placeholder=" Phone number include 8 to 11 digits" /></span>
                    <font class="error" id="phone" style="color: red"></font>
                </div>
            </li>
        </ul>
        <div class="form-buttons">
            <button  onclick="return AccountInfo()" value="UpdateInfo" class="button"><span><span>Update</span></span></button>
        </div>
        <font id="infoMessage" align="center" style="color: #000066; font-weight: bold;"></font>

        <!--Change Password-->
        <div>
            <h3>CHANGE PASSWORD</h3>
        </div>
        <ul>
            <li>
                <div>
                    <label class="required"><em>*</em>Password</label>
                    <span><input type="password" name="txtOldPass" value="" id="txtOldPass" class="input-text required-entry validate-password" value="" maxlength="15" placeholder=" Password must be from 6 to 15 characters" /></span>
                    <font class="error" id="oldPass" style="color: red"></font>
                </div>
            </li>

            <li>
                <div>
                    <label class="required"><em>*</em>New Password</label>
                    <span><input type="password" name="txtNewPass" value="" id="txtNewPass" class="input-text required-entry validate-password" value="" maxlength="15" placeholder=" Password must be from 6 to 15 characters" /></span>
                    <font class="error" id="newPass" style="color: red"></font>
                </div>
            </li>

            <li>
                <div>
                    <label class="required"><em>*</em>Confirm New Password</label>
                    <span><input type="password" name="txtConfirmPass" value="" id="txtConfirmPass" class="input-text required-entry validate-password" value="" maxlength="15" placeholder=" Password must be from 6 to 15 characters" /></span>
                    <font class="error" id="confirmPass" style="color: red"></font>
                </div>
            </li>
        </ul>
        <div>
            <p><a href="Controller?btnAction=home"><small>« </small>Home</a></p>
            <button onclick="return AccountPassword()" value="ChangePassword"><span><span>Update</span></span></button>
        </div>
    </body>
</html>
